
<body>

	<div class="warp h">
		<!--header-->
		<header class="hd br">
			<?php if(! isset($dataFromGet)): ?>
	        <a href="<?php echo $base_url; ?>home/address" class="l-icon only-icon">
	    	<?php else:?>
	        <a href="<?php echo $base_url; ?>home/address?data=<?php echo urlencode($dataFromGet);?>" class="l-icon only-icon">
	    	<?php endif;?>
			<!-- <a href="<?php echo $base_url; ?>/home/address" class="l-icon only-icon"> -->
            <i class="iconfont icon-left1"></i>
        </a>
			<p class="tit2">
				<?php echo $title; ?>
			</p>

		</header>

		<ul class="msg-bar">
			<li>

				<span class="l">收货人</span>
				<input type="text" id="consignee" class="input_txt" value="<?php echo $content['consignee']; ?>">
			</li>
			<li>

				<span class="l">联系电话</span>
				<input type="text" id="mobile" class="input_txt" value="<?php echo $content['mobile']; ?>">
			</li>
			<li>
				<a href="#" id="city">
                <span class="l">所在地区</span>
                <span class="r" id="location" data-provinceid="<?php echo $content['province'];?>" data-cityid="<?php echo $content['city'];?>" data-districtid="<?php echo $content['district'];?>">
                    <?php echo $content['provincetxt'] . $content['citytxt'] . $content['districttxt'];?>
                    <i class=" iconfont icon-left">
                    </i>
                </span>
            </a>
			</li>
			<li class="textarea-bar">
				<textarea placeholder="请填写详细地址，不少于5个字" id="address"><?php echo $content['address']; ?></textarea>
			</li>
		</ul>

		<div class="save-btn-2">
			<a class="del-btn" id="del" data-id="">删除收货信息</a>
			<a href="javascript:" class="save-btn" id="save">保存收货信息</a>
		</div>

		<div class="line-box"></div>

		<div class="pd-box"></div>


		<div class="modal-alter">
			<div class="cont">
				<div class="w">
					<p>您确定删除该地址吗？</p>
				</div>
			</div>
			<div class="ft">
				<a href="#" class="cancel">取消</a>
				<a href="#" class="confirm">确认</a>
			</div>
		</div>

	</div>
	<div class="maksbox">
	</div>
	<script src="<?php echo $base_url; ?>static/dist/js/base.js"></script>
	<script src="<?php echo $base_url; ?>static/dist/js/lib/picker.min.js"></script>
	<script src="<?php echo $base_url; ?>static/js/common.js"></script>
	<script>
		// 矫正rem
		function correctrem() {
			var rem_full_width = $("<div id='rem-test' style='width:7.5rem'></div>").appendTo($('body')).width();
			var device_width = Math.min(document.documentElement.clientWidth, 640);
			if (rem_full_width !== device_width) {
				document.documentElement.style.fontSize = (device_width / 7.5) * (device_width / rem_full_width) + 'px';
			}
			$('#rem-test').remove();
		}
		correctrem();
		$(function () {
			$('#save').on('click', function () {
				consignee = $('#consignee').val().trim()
                mobile = $('#mobile').val().trim();
                address = $('#address').val().trim();
                provinceid = $('#location').data('provinceid');
                cityid = $('#location').data('cityid');
                districtid = $('#location').data('districtid');
                if( consignee == '' || mobile == '' || address == '' ||
                	provinceid == undefined || cityid == undefined )
                {
                	toastShow('请补全收货地址信息');
                	return;
                }
				var mobileReg = new RegExp("^[0-9]*$");
                if(!mobileReg.test(mobile)){
			        toastShow("联系电话应为纯数字");
			        return;
			    }
			    if(address.length < 5 || address.length>30)
			    {
			    	toastShow('详细地址输入不完整或太长');
			    	return;
			    }
				if(consignee.length<2 || consignee.length > 15){
					toastShow('收货人填写错误');
			    	return;
				}				

				$.ajax({
					url: "<?php echo $base_url; ?>home/address/edit/<?php echo $content['address_id'];?><?php if(isset($dataFromGet)) echo '?data=' . urlencode($dataFromGet);?>",
					data: {
						consignee: consignee,
						mobile: mobile,
						provinceid: provinceid,
						cityid: cityid,
						districtid: districtid,
						address: address
					},
					dataType: 'json',
					type: 'POST',
					success: function (data) {
						console.log(data);
						if (data.result == 0) {
							location.href = "<?php echo $base_url; ?>home/address<?php if(isset($dataFromGet)) echo '?data=' . urlencode($dataFromGet);?>";
						} else {
							toastShow(data.errmsg);
						}
					}
				});
			});
		});



		function getProvince(cb) {
			$.ajax({
				url: "/home/address/getZonesByID?zoneid=1",
				type: "GET",
				success: function (data) {
					cb(data);
				},
				error: function (xhr, type) {
					console.log('Ajax error');
				}
			})
		}

		function getUrbanDistrict(id, cb) {
			$.ajax({
				url: "/home/address/getZonesByParentID?zoneid=" + id,
				type: "GET",
				success: function (data) {
					cb(data);
				},
				error: function (xhr, type) {
					console.log('Ajax error');
				}
			})
		}


		function formatData(data) {
			var newRes = [];
			for (var i = 0; i < data.length; i++) {
				// console.log(data[i]);
				newRes[i] = {};
				newRes[i].value = data[i].id
				newRes[i].text = data[i].name
			}
			return newRes;
		}

		var picker;

		getProvince(function (data) {
				var $location =  $('#location'),
					provinceid = $location.data("provinceid")
					cityid = $location.data("cityid")
					districtid = $location.data("districtid")
			var provinceData = formatData(JSON.parse(data));

			getUrbanDistrict(provinceid, function (data) {
				var cityData = formatData(JSON.parse(data));
				getUrbanDistrict(cityid, function (data) {
					var areaData = formatData(JSON.parse(data));
					
					picker = new Picker({
						data: [provinceData, cityData, areaData],
						selectedIndex: [findData(provinceid,provinceData), findData(cityid,cityData), findData(districtid,areaData)],
						// title: '地址选择'
					});
					picker.on('picker.select', function (selectedVal, selectedIndex) {
						var province = provinceData[selectedIndex[0]].text;
						var city = cityData[selectedIndex[1]].text
						var area = areaData[selectedIndex[2]].text
						$("#location").data("provinceid",provinceData[selectedIndex[0]].value)
						$("#location").data("cityid",cityData[selectedIndex[1]].value)
						$("#location").data("districtid",areaData[selectedIndex[2]].value)
						$("#city").find('.r').html(province + city + area + ' <i class=" iconfont icon-left"></i>');


					});

					picker.on('picker.change', function (index, selectedIndex) {
						if (index == 0) {
							var dataID = provinceData[selectedIndex].value;
							getUrbanDistrict(dataID, function (data) {
								cityData = formatData(JSON.parse(data));
								getUrbanDistrict(cityData[0].value, function (data) {
									areaData = formatData(JSON.parse(data));
									picker.refillColumn(1, cityData);
									picker.refillColumn(2, areaData);
									picker.scrollColumn(1, 0)
									picker.scrollColumn(2, 0)
								});
							})

						} else if (index == 1) {
							var dataID = cityData[selectedIndex].value;
							getUrbanDistrict(dataID, function (data) {
								areaData = formatData(JSON.parse(data));
								picker.refillColumn(2, areaData);
								picker.scrollColumn(2, 0)
							});
						}


					});
					// picker.on('picker.valuechange', function (selectedVal, selectedIndex) {
					// 	console.log(selectedVal);
					// 	console.log(selectedIndex);
					// });
				})

			})

		})


		function findData(value,data){
			var i = 0, resIndex = 0;
			for(i; i<data.length;i++){
				if(data[i].value == value){
					resIndex = i;
					break;
				}
				
			}
			return resIndex;
		}



		$("#city").on('click', function () {
			picker.show();
		});
		function alertShow(){
			$(".maksbox").addClass("active");
			$(".modal-alter").addClass("active");
		}
		//  $(".maksbox").on('click',function(){
		//      $(".modal-alter").removeClass("active");
		//      $(this).removeClass("active");

		//  })
		$("#del").on('click', function () {
			alertShow()
		})
		$(".cancel").on('click',function(){
			$(".modal-alter").removeClass("active");
			$(".maksbox").removeClass("active");
		})
		$(".confirm").on('click',function(){
			var postData = {};
			postData.address_id = <?php echo $content['address_id'];?>;
			<?php if(isset($dataFromGet)): ?>
			postData.data = '<?php echo urlencode($dataFromGet); ?>'
			<?php endif; ?>
			$.ajax({
				url: "<?php echo $base_url; ?>home/address/deladdressbyid",
				dataType: 'json',
				type: 'POST',
				data: postData,
				success: function (data) {
					console.log(data);
					if (data.result == 0) {
						location.href = "<?php echo $base_url; ?>home/address<?php if(isset($dataFromGet)) echo '?data=' . urlencode($dataFromGet);?>";
					} else {
						alert(data.errmsg);
					}
				}
			});
		})
	</script>

</body>

</html>
